import React, { useEffect } from 'react'

import { getCategoryListData } from './api/kind'

import { useDispatch, useSelector } from 'react-redux'

import { changeKindList } from './store/modules/kind'

export default function Kind() {

    const dispatch = useDispatch()

    const list = useSelector(state => state.kind.kindList)

    useEffect(() => {
        getCategoryListData().then(res => {
            // console.log(res.data.data);
            dispatch(changeKindList(res.data.data))
        })
    }, [])

    return (
        <div>
            <ol>
                {list.map(item => <p key={item}>{item}</p>)}
            </ol>
        </div>
    )
}
